import React, { Fragment, useContext } from 'react'
import { Layout, Menu } from 'antd';
import { 
  UserOutlined,
  TableOutlined,
  FundProjectionScreenOutlined,
  RadarChartOutlined, 
  EditOutlined, 
  TeamOutlined,
  ProfileOutlined 
} from '@ant-design/icons';
import "./homeSider.less"
import { Context } from '../../../App';

const { Sider } = Layout;

const getItem = (label, key, icon, children, type)=>({
    key,
    icon,
    children,
    label,
    type,
})

const items = {
  student:[
    getItem("用户信息","userInfor",<UserOutlined />),
    getItem("培养计划","trainingPlan",<FundProjectionScreenOutlined />),
    getItem("成绩","grades",<RadarChartOutlined />),
    getItem("考试","examination",<EditOutlined />),
    getItem("学籍","studentStatus",<TeamOutlined />),
    getItem("课表管理","course",<TableOutlined />),
    getItem("公告","announcement",<ProfileOutlined />),
  ],
  teacher:[
    getItem("用户信息","userInfor",<UserOutlined />),
    getItem("培养计划","trainingPlan",<FundProjectionScreenOutlined />),
    getItem("成绩","grades",<RadarChartOutlined />),
    getItem("考试","examination",<EditOutlined />),
    // getItem("学籍","studentStatus",<TeamOutlined />), 暂且不需要
    getItem("课表管理","course",<TableOutlined />),
    getItem("课程","curriculum",<ProfileOutlined />),
    getItem("学生信息","studentInfors",<ProfileOutlined />),
    getItem("公告","announcement",<ProfileOutlined />),
  ]
};

// const newItems = items.student //学生权限
// const newItems = [...items.student,...items.teacher] //教师权限

export default function HomeSider({changUrl,urlKey}) {

  const {role} = useContext(Context)
  let newItems = role?.fd_type === "student" ? items.student : role?.fd_type === "teacher" ? items.teacher :[]

  const onClick = (e) => {
    changUrl(`/home/${e.key}`,{replace:true},e.key)
  };

  return (
    <Fragment>
      <Sider width={220} className="home-sider">
        <Menu
          onClick={onClick}
          style={{ width: 220 }}
          selectedKeys={urlKey}
          mode="inline"
          items={newItems}
          className="sider-nav"
        />
      </Sider>
    </Fragment>
  )
}
